:root {
  --menu-border-width: 5px;
  --menu-mini-width: 2.5rem;
  --menu-maxi-width: 15.625rem;
  --menu-slide-margin: -13.125rem;
  --padding-xs: 2.5px;
  --padding-s: 5px;
  --padding-r: 7.5px;
  --padding-m: 10px;
  --padding-l: 15px;
  --padding-xl: 20px;
  --padding-2xl: 25px;
  --padding-3xl: 30px;
  --padding-4xl: 35px;
  --padding-5xl: 40px;
  --padding-6xl: 45px;
  --padding-7xl: 50px;
  --negative-padding-s: -5px;
  --negative-padding-m: -10px;
  --negative-padding-l: -15px;
  --negative-padding-xl: -20px;
  --print-padding-s: 1.25pt;
  --print-padding-r: 2.5pt;
  --print-padding-m: 5pt;
  --print-padding-l: 10pt;
  --print-padding-xl: 15pt;
  --print-padding-2xl: 20pt;
  --variable-horizontal-padding-xs: .3125rem;
  --variable-horizontal-padding-s: .9375rem;
  --variable-horizontal-padding-m: 1.875rem;
  --variable-horizontal-padding-l: 2.8125rem;
  --negative-variable-horizontal-padding-s: -.9375rem;
  --negative-variable-horizontal-padding-m: -1.875rem;
  --variable-vertical-padding-m: .625rem;
  --variable-vertical-padding-l: 1.25rem;
  --variable-vertical-padding-xl: 2.5rem;
  --icon-size-s: 1.125rem;
  --icon-size-m: 1.5rem;
  --icon-size-l: 2rem; }

@media (max-width: 75rem) {
  :root {
    --menu-horizontal-padding: 1rem;
    --menu-horizontal-negative-margin: -1rem;
    --menu-link-padding: calc( 1rem - 5px );
    --menu-sub-link-padding: calc( 1rem + 5px ); } }

@media (min-width: 75rem) {
  :root {
    --menu-horizontal-padding: 2rem;
    --menu-horizontal-negative-margin: -2rem;
    --menu-link-padding: calc( 2rem - 5px );
    --menu-maxi-width: 18.75rem;
    --menu-slide-margin: -16.25rem;
    --menu-sub-link-padding: calc( 2rem + 10px ); } }

body.caerp.login-view .layout {
  height: 100vh; }

body.caerp.login-view .two_cols.third .login_form {
  padding: var(--padding-5xl); }

body.caerp.login-view .login_form {
  box-shadow: 0 0 10px var(--login-atwork-shadow-color);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 10; }
  body.caerp.login-view .login_form .logos {
    flex: 1 0 auto; }
    body.caerp.login-view .login_form .logos .flex {
      align-items: center;
      display: flex;
      justify-content: space-between; }
    body.caerp.login-view .login_form .logos .caerp_logo,
    body.caerp.login-view .login_form .logos .cae_logo {
      height: auto;
      max-height: 3rem;
      max-width: 40%;
      width: auto; }
  body.caerp.login-view .login_form .loginbox {
    flex: 3 0 auto; }
  body.caerp.login-view .login_form form {
    padding-bottom: 30px; }
    body.caerp.login-view .login_form form input[type="text"],
    body.caerp.login-view .login_form form input[type="password"] {
      width: 100%; }
  body.caerp.login-view .login_form .login_footer {
    align-items: flex-end;
    display: flex;
    font-size: .75rem;
    justify-content: space-between;
    flex: 0 0 auto; }
    body.caerp.login-view .login_form .login_footer p:first-child {
      margin-right: var(--padding-s); }
    body.caerp.login-view .login_form .login_footer p:last-child {
      margin-left: var(--padding-s);
      text-align: right; }
    body.caerp.login-view .login_form .login_footer a {
      text-decoration: none; }
    body.caerp.login-view .login_form .login_footer a:hover,
    body.caerp.login-view .login_form .login_footer a:focus,
    body.caerp.login-view .login_form .login_footer a:active {
      text-decoration: underline; }
  body.caerp.login-view .login_form footer {
    font-size: .75rem;
    padding: var(--padding-m) 0 0;
    text-align: center; }

body.caerp.login-view .atwork_photo {
  background-color: var(--static-color);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative; }
  body.caerp.login-view .atwork_photo > p {
    background: var(--login-atwork-background-color);
    bottom: 10px;
    font-size: .75rem;
    padding: var(--padding-s) var(--padding-m);
    position: absolute;
    right: 10px;
    text-align: right;
    text-shadow: 0 0 1px var(--login-text-shadow-color);
    max-width: calc(100% - 20px); }
    body.caerp.login-view .atwork_photo > p:hover {
      background: var(--login-atwork-hover-background-color); }

body.caerp.login-view .login_icons {
  align-items: center;
  background-color: var(--static-color);
  display: flex;
  justify-content: center; }
  body.caerp.login-view .login_icons > div {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    height: 24vw;
    justify-content: center;
    width: 24vw; }
  body.caerp.login-view .login_icons svg {
    fill: var(--static-invert-color);
    height: 4vw;
    margin: 0 2vw;
    width: 4vw; }

@media (max-width: 31.25rem) {
  body.caerp.login-view .layout.flex {
    max-width: 100vw; }
  body.caerp.login-view .two_cols.third .login_form {
    padding: var(--padding-5xl) 0; }
    body.caerp.login-view .two_cols.third .login_form > div {
      padding-left: var(--padding-m);
      padding-right: var(--padding-m); }
  body.caerp.login-view .login_form {
    box-shadow: none; }
    body.caerp.login-view .login_form form {
      padding-top: 40px; }
  body.caerp.login-view .login_icons > div {
    height: 60vw;
    width: 60vw; }
    body.caerp.login-view .login_icons > div svg {
      height: 12vw;
      margin: 4vw;
      width: 12vw; } }

@media (max-width: 50rem) and (min-width: 31.25rem) {
  body.caerp.login-view .logos {
    left: var(--padding-xl);
    position: absolute;
    top: 50px; }
    body.caerp.login-view .logos .flex {
      flex-direction: column; }
    body.caerp.login-view .logos .cae_logo {
      margin-top: var(--padding-5xl); }
  body.caerp.login-view .login_form form,
  body.caerp.login-view .login_form .login_footer,
  body.caerp.login-view .login_form footer {
    margin-left: 11.125rem; }
  body.caerp.login-view .login_form .login_footer {
    padding-top: 20px; }
  body.caerp.login-view .login_icons > div {
    height: 30vw;
    width: 30vw; }
    body.caerp.login-view .login_icons > div svg {
      height: 6vw;
      margin: 2vw;
      width: 6vw; } }

@media (max-width: 50rem) {
  body.caerp.login-view {
    overflow-y: auto; }
    body.caerp.login-view .layout {
      height: auto;
      min-height: 100vh; }
    body.caerp.login-view .two_cols.third .login_form {
      flex-basis: 100% !important;
      padding: var(--padding-5xl) var(--padding-xl); }
      body.caerp.login-view .two_cols.third .login_form form {
        flex: 1 0 auto; }
    body.caerp.login-view .atwork_photo,
    body.caerp.login-view .login_icons {
      flex-basis: 100% !important;
      min-height: 50vh; } }
